<template>
  <div>
    <b-alert
      dismissible variant="danger"
      :show="showAlert" @dismissed="showAlert=false"
    >数据加载失败</b-alert>
    <b-card class="luke-table-sm">
      <b-row slot="header">
        <h3 class="luke-table-heading">三天未登录</h3>
        <b-button variant="primary" class="luke-table-refresh" @click="refresh">
          刷新
        </b-button>
      </b-row>
      <b-table
        striped bordered responsive show-empty
        :items="items" :fields="fields"
      >
        <template slot="empty">
          <p class="luke-loading-text">加载中...</p>
        </template>
      </b-table>
    </b-card>
  </div>
</template>

<script>
  import Config from '@/assets/global-config'
  import axios from 'axios'
  export default {
    name: 'NotLogin',
    data () {
      return {
        fields: {
          id: { label: 'ID' },
          name: { label: '昵称' },
          amount: { label: '金额' },
          referral: { label: '介绍人ID' }
        },
        items: [],
        showAlert: false
      }
    },
    created () {
      this.fetchData()
    },
    methods: {
      fetchData () {
        let originData = this.items
        this.items = []
        var that = this
        axios.post(Config.not_login_action())
        .then(function (response) {
          that.showAlert = false
          that.items = response.data
        })
        .catch(function (error) {
          console.log(error)
          that.showAlert = true
          that.items = originData
        })
      },
      refresh () {
        this.fetchData()
      }
    }
  }
</script>
